import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import CoreLayout from 'containers/layout'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { protoActions } from 'reduxs'
import PubSub from 'pubsub-js'
import { Button, Popconfirm } from 'antd'
import { getFlagValue, getPageFlag } from 'services/utils'
import QueryTable from '../components/query-table'
import moment from 'moment'

const accessFlag = getPageFlag('/proto-tool/notice', 'access')
const sendFlag = getPageFlag('/proto-tool/notice', 'send')
const removeFlag = getPageFlag('/proto-tool/notice', 'remove')

@connect(
  state => ({
    auth                : state.Passport.auth,
    rtsp_key            : state.Passport.rtsp_key,
    listData            : state.Proto.listData,
    postDataPending     : state.Proto.postDataPending,
    postDataError       : state.Proto.postDataError,
    postDataMessage     : state.Proto.postDataMessage,
    postData            : state.Proto.postData,
    postDataProto       : state.Proto.postDataProto,
    srv                 : state.Proto.srv
  }),
  dispatch => ({
    actions: bindActionCreators({ 
      ...protoActions
    }, dispatch)
  })
)
export default class Notice extends PureComponent {
  
  componentWillReceiveProps (nextProps) {
    const { postDataError, postDataMessage, postDataProto } = nextProps
    if (postDataError > 0 && postDataMessage !== this.props.postDataMessage) {
      
    }
    if (postDataError === 0 && postDataProto === 'del-notice' && postDataMessage !== this.props.postDataMessage) {
      this.props.actions.postData('notice-list', {}, this.props.rtsp_key)
    }
  }

  render () {
    const { location, auth, listData, srv } = this.props
    let serverOpts = null
    let protoSett = null
    if (listData) {
      protoSett = _.find(listData, o => o.name === 'send-notice')
      serverOpts = _.isString(protoSett.options.srv) ? srv : protoSett.options.srv
    }
    let options = {
      layoutOptions: {
        location,
        pageCode: accessFlag.value,
        breadcrumb: [
          { name: '主页', link: '/' },
          { name: '运营工具类' },
          { name: '系统公告' }
        ],
      },
      searchOptions: {
        
      },
      proto: 'notice-list',
      initialData: true,
      tableColumns: [
        {
          key: '1',
          title: '公告内容',
          dataIndex: 'content',
        },
        {
          key: '2',
          title: '循环间隔',
          dataIndex: 'times',
          render: (times) => `${times} 分钟`,
          width: 100
        },
        {
          key: '3',
          title: '循环次数',
          dataIndex: 'dif',
          render: (dif) => parseInt(dif) === -1 ? '无限' : dif,
          width: 100
        },
        {
          key: '4',
          title: '开始时间',
          dataIndex: 'startime',
          render: (startime) => moment(parseInt(startime)).format('YYYY-MM-DD HH:mm:ss'),
          width: 200
        },
        {
          key: '5',
          title: '服务器',
          dataIndex: 'srv',
          render: (srv) => serverOpts ? serverOpts[srv] : srv,
          width: 100
        },
        {
          key: '6',
          title: '操作',
          dataIndex: 'actions',
          render: (text, record) => (
            <Popconfirm title={`确定要删除该公告吗？`}
              onConfirm={() => this.handleRemoveNotice({ key: record.startime })}
              disabled={getFlagValue(auth, removeFlag.value, null)}
              >
              <a>删除</a>
            </Popconfirm>
          ),
          width: 100
        }
      ],
      tableScroll: { },
      tablePagination: true,
      tools: [
        <Button
          onClick={() => PubSub.publish('OPEN_MODAL', 'AddProtoNoticeModal')}
          disabled={getFlagValue(auth, sendFlag.value, null)}
          >
          添加公告
        </Button>
      ],
      refresh: true,
      //remark: []

    }
    return (
      <QueryTable  {...options} />
    )
  }

  handleRemoveNotice = ({ key }) => {
    this.props.actions.postData('del-notice', { key }, this.props.rtsp_key)
  }
}